<!DOCTYPE html>
<html>
<head>
    <meta name="viewport" content="width=device-width, minimum-scale=1, initial-scale=1.0, maximum-scale=1, user-scalable=no" charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="renderer" content="webkit|ie-comp|ie-stand">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" type="text/css" href="/pc/css/media.css"/>
    <link rel="stylesheet" type="text/css" href="/pc/css/common.css"/>

    <title>云主机</title>
    <link href="/pc/css/mui.picker.css" rel="stylesheet" />
    <link href="/pc/css/mui.poppicker.css" rel="stylesheet" />
    <script src="//do.yunzhijia.com/pub/js/qingjs.js"></script>
    <link href="//cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
    <link href="//cdn.bootcss.com/bootstrap-slider/9.4.1/css/bootstrap-slider.css" rel="stylesheet">
    <link rel="stylesheet" type="text/css" href="/pc/css/index.css"/>
    <script src="/pc/js/jquery-3.0.0.min.js"></script>
    <script src="/layer/layer.js"></script>
    <script src="http://cdn.bootcss.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
    <script src="http://cdn.bootcss.com/bootstrap-slider/9.4.1/bootstrap-slider.min.js"></script>
</head>
<body style="background: #eaeff3;">
<div class="main_div">
  <div class="main_body">

    <p class="topTip_p">云主机价格由CPU，内存，带宽组成，客户经理折扣为6折，价格计算器为标准价格（元/月.台）。</p>
    <div class="listing">
        <div class="items">
            <div class="item">
                <div class="iconDiv"><i>
                    <img src="/pc/image/icon-1.png" width="22px"; height="22px">
                </i></div>
                <h4 class="title">实例配置</h4>
                <ul class="config_ul">
                    <li id="showCPUPicker">
                        <span class="left">CPU数量</span>
                        <div class ="rightDiv" >
                            <span class="left one" id='userResult'>1</span><i class="_icon left" >
                            <img src="/pc/image/go_right.png">
                        </i>
                        </div>

                    </li>
                    <li id='showMemoryPicker'>
                        <span class="left">内存容量</span>
                        <div class ="rightDiv"  class="mui-btn mui-btn-block">
                            <span class="left one" id='MemoryResult'>1GB</span><i class="_icon left" ><img src="/pc/image/go_right.png"></i>
                        </div>
                    </li>
                </ul>
            </div>
            <div class="summary_div">
                <ul class="configInfo_ul left">
                    <li>CPU *<span id = "cpuCount" value="1">1</span></li>
                    <li><span id="MemoryCount" value="1">1</span>GB</li>
                </ul>
                <p class="price_p right " id="cpu_price">￥53</p>
            </div>
        </div>
        <div class="items">
            <div class="item">
                <div class="iconDiv"><i>
                    <img src="/pc/image/icon-2.png" width="22px"; height="22px">
                </i></div>
                <h4 class="title">存储配置（添加数据盘）</h4>
                <ul class="config2_ul" id="list">
                    <li data-stat="1">
                        <div class="_config_div left add" id="showstoragePicker">
                            <span class="left" id="storageResult">SATA</span>
                            <i class="right"><img src="/pc/image/go_right.png"></i>
                        </div>
                        <div class="_config_div wid35 left zhuiRou">
                            <div class="stat_minus minus1"><i>
                                <img src="/pc/image/Group_MINUS.png" class="img_class"></i>
                            </div>
                            <input type="tel" pattern="[0-9]*" maxlength="4" id="statnum" class="stat_num input_bg1 zhou" value="0">
                            <div class="stat_plus plus1"><i><img src="/pc/image/Group_PLUS.png" class="img_class"></i></div>
                        </div>
                        <#--<div class="delet right">X</div>-->
                    </li>
                    <li class="addConfig"><i><img src="/pc/image/Group_PLUS.png"></i></li>
                </ul>
            </div>
            <div class="summary_div">
                <ul class="configInfo_ul left">
                    <li class="tatil_stat"></li>
                    <#--<li>2000GB</li>-->
                </ul>
                <p class="price_p right"  id="stat_total_price">￥30</p>
            </div>
        </div>
        <div class="items">
            <div class="item">
                <div class="iconDiv"><i>
                    <img src="/pc/image/icon-3.png" width="22px"; height="22px">
                </i></div>
                <h4 class="title">带宽</h4>
                <ul class="config2_ul">
                    <li class="zhu">
                        <div class=" left huahua" style="width: 56%;">
                            <!--滚动条框-->
                            <input id="ex1" data-slider-id='ex1Slider' type="text" data-slider-min="0" data-slider-max="300" data-slider-step="10" data-slider-value="0" value="0"/>
                        </div>
                        <div class="_config_div wid35 brand_num_text ">
                            <div class="minus"><i><img src="/pc/image/Group_MINUS.png" class="img_class"></i>
                            </div>
                            <input type="tel" id="testNum" pattern="[0-9]*"  maxlength="3" class="brand_num input_bg testNum" value="0"/>
                            <div class="plus">
                                <i>
                                <img src="/pc/image/Group_PLUS.png" class="img_class">
                            </i></div>
                        </div>
                    </li>
                </ul>
            </div>
            <div class="summary_div">
                <ul class="configInfo_ul left">
                    <li class="brand_num  brand"></li>
                </ul>
                <p class="price_p right brand_price" id="brand_price"></p>
            </div>
        </div>
        <#--<div class="items addToList_items">
            <div class="addToList_div">
                <#include "list_tip.ftl">
            </div>
        </div>-->
    </div>
  </div>
        <#include "foot.ftl">

<#--//九个计算值
        //CPU-->
        <input type="hidden" id="total_cpu_t" name="total_cpu_t" value="0">
        <input type="hidden" id="total_cpu_a" name="total_cpu_a" value="0">
        <input type="hidden" id="total_cpu_d" name="total_cpu_d" value="0">


        <#--//存储-->
        <input type="hidden" id="total_stat_t" name="total_stat_t" value="0">
        <input type="hidden" id="total_stat_a" name="total_stat_a" value="0">
        <input type="hidden" id="total_stat_d" name="total_stat_d" value="0">

        <#--//带宽-->
        <input type="hidden" id="total_brand_t" name="total_brand_t" value="0">
        <input type="hidden" id="total_brand_a" name="total_brand_a" value="0">
        <input type="hidden" id="total_brand_d" name="total_brand_d" value="0">
        <input type="hidden" id="tx_sata_tag" name="tx_sata_tag" value="0">
<#-- 三个电信stat-->
    <input type="hidden" name="d_sata_price" value="${memoryShop[0].price!}" id="d_sata_price" class="d_sata_price">
    <input type="hidden" name="ali_sata_price" value="${memoryShop[0].aliPrice!}" id="ali_sata_price" class="ali_sata_price">
    <input type="hidden" name="tx_sata_price" value="${memoryShop[0].tencentPrice!}" id="tx_sata_price" class="tx_sata_price">
<#--三个电信ssd-->
    <input type="hidden" name="d_ssd_price" value="${memoryShop[2].price!}" id="d_ssd_price" class="d_ssd_price">
    <input type="hidden" name="ali_ssd_price" value="${memoryShop[2].aliPrice!}" id="ali_ssd_price" class="ali_ssd_price">
    <input type="hidden" name="tx_ssd_price" value="${memoryShop[2].tencentPrice!}" id="tx_ssd_price" class="tx_ssd_price">
<#--三个电信sas--->
    <input type="hidden" name="d_sas_price" value="${memoryShop[1].price!}" id="d_sas_price" class="d_sas_price">
    <input type="hidden" name="ali_sas_price" value="${memoryShop[1].aliPrice!}" id="ali_sas_price" class="ali_sas_price">
    <input type="hidden" name="tx_sas_price" value="${memoryShop[1].tencentPrice!}" id="tx_sas_price" class="tx_sas_price">




<input type="hidden" name="flag" id="flag" value="0">
<input type="hidden" name="flagNum" id="flagNum" value="0">
<input type="hidden" name="flag_die" id="flag_die" value="1">
<input type="hidden" name="flag_die_flag" id="flag_die_flag" value="1">
<input type="hidden" name="title" id="title" value="${title!}">
<input type="hidden" name="openId" id="openId" value="${openId}">
</div>
<script src="/pc/js/mui.min.js"></script>
<script src="/pc/js/mui.poppicker.js"></script>
<script src="/pc/js/mui.picker.min.js"></script>
<script src="/pc/js/yun_title.js"></script>
<script>
    function  getAllPrice() {
        var statInput=document.getElementById("statnum");
        var brand_price=document.getElementById("brand_price").innerText;
        var all_dx_price=document.getElementById("allprice");
        var  dx_cpu_price=document.getElementById("cpu_price").innerText;

        var sata_price=document.getElementById("stat_total_price").innerText;
        var ali_price=document.getElementById("total_cpu_a").value;
        var tx_price=document.getElementById("total_cpu_t").value;


        var  ali_stat_price=document.getElementById('total_stat_a').value;
        var  tx_stat_price=document.getElementById('total_stat_t').value;

        var ali_brand_price=document.getElementById('total_brand_a').value;

        var tx_brand_price=document.getElementById('total_brand_t').value;
       var temp=dx_cpu_price.substring(1);
       var temp2=brand_price.substring(1);
       var temp3=sata_price.substring(1);
       if(!(statInput.value=="0")){
           var tag=document.getElementById('tx_sata_tag');
           if(ali_price=="0"||ali_stat_price=="0.00"){
               $("#ali_price").html("无此规格");
           }
           else {
               $("#ali_price").html("￥"+(parseInt(ali_price)+parseInt(ali_brand_price)+parseFloat(ali_stat_price)).toFixed(2));
           }
           if(tx_stat_price=="0.00"||tx_price=="0"||tag.value=="404"){
               $("#tx_price").html("无此规格");
           }
           else {
               $("#tx_price").html("￥"+(parseInt(tx_price)+parseInt(tx_brand_price)+parseFloat(tx_stat_price)).toFixed(2));
           }
       }
       else if(statInput.value=="0") {
           if(ali_price=="0"){
               $("#ali_price").html("无此规格");
           }
           else {
               $("#ali_price").html("￥"+(parseInt(ali_price)+parseInt(ali_brand_price)+parseFloat(ali_stat_price)).toFixed(2));
           }
           if(tx_price=="0"){
               $("#tx_price").html("无此规格");
           }
           else {
               $("#tx_price").html("￥"+(parseInt(tx_price)+parseInt(tx_brand_price)+parseFloat(tx_stat_price)).toFixed(2));
           }
       }

        $("#allprice").html("￥"+(parseInt(temp2)+parseInt(temp)+parseFloat(temp3)).toFixed(2));

    }
    function count() {
        var stat_name=new Array();
        var stat_num=new Array();
        var index=0;
        $('#list li[data-stat]').each(function () {
            stat_name[index]=$(this).find("span").text();
            stat_num[index]=$(this).find("input").val();
            index++;

            });

        //计算价格
        getstat_num_price(stat_name,stat_num);
        //统计个数
        $('.tatil_stat').html(getstat_name_count(stat_name));


    };

    function getstat_num_price(stat_name,stat_num) {
        var d_sata_price=document.getElementById("d_sata_price").value;
        var d_ssd_price=document.getElementById("d_ssd_price").value;
        var d_sas_price=document.getElementById("d_sas_price").value;

        var ali_sata_price=document.getElementById("ali_sata_price").value;
        var ali_ssd_price=document.getElementById("ali_ssd_price").value;
        var ali_sas_price=document.getElementById("ali_sas_price").value;

        var tx_sata_price=document.getElementById("tx_sata_price").value;
        var tx_ssd_price=document.getElementById("tx_ssd_price").value;
        var tx_sas_price=document.getElementById("tx_sas_price").value;


        var temp=0.00;
        var total_price=0.00
        var ali_total_price=0.00;
        var tx_total_price=0.00;


        var ali_stat_price=document.getElementById("total_stat_a");
        var tx_stat_price=document.getElementById("total_stat_t");
        var temp1=0.00;
        var temp2=0.00;
        var tag=document.getElementById('tx_sata_tag');
        for(var i=0;i<stat_name.length;i++){
            if(stat_name[i]=="SATA"){
                /*d_sata_price=0.30;
                ali_sata_price=0.27;
                tx_sata_price=0;*/
                temp=(d_sata_price*stat_num[i]).toFixed(2);
                total_price=parseFloat(parseFloat(total_price)+parseFloat(temp)).toFixed(2);

                temp1=(ali_sata_price*stat_num[i]).toFixed(2);
                ali_total_price=parseFloat(parseFloat(ali_total_price)+parseFloat(temp1)).toFixed(2);
                ali_stat_price.value=ali_total_price;
            }
            else if(stat_name[i]=="SSD"){
                /*d_ssd_price=1.20;
                ali_ssd_price=0.8;
                tx_ssd_price=1.1;*/
                temp=(d_ssd_price*stat_num[i]).toFixed(2);
                total_price=parseFloat(parseFloat(total_price)+parseFloat(temp)).toFixed(2);

                temp1=(ali_ssd_price*stat_num[i]).toFixed(2);
                ali_total_price=parseFloat(parseFloat(ali_total_price)+parseFloat(temp1)).toFixed(2);
                ali_stat_price.value=ali_total_price;

                temp2=(tx_ssd_price*stat_num[i]).toFixed(2);
                tx_total_price=parseFloat(parseFloat(tx_total_price)+parseFloat(temp2)).toFixed(2);
                tx_stat_price.value=tx_total_price;
                /*tag.value=(0);*/
            }
            else if(stat_name[i]=="SAS"){
                /*d_sas_price=0.60;
                * 变更价格
                *
                */
                /*d_sas_price=0.40;
                ali_sas_price=0.35;
                tx_sas_price=0.3;*/
                temp=(d_sas_price*stat_num[i]).toFixed(2);
                total_price=parseFloat(parseFloat(total_price)+parseFloat(temp)).toFixed(2);


                temp1=(ali_sas_price*stat_num[i]).toFixed(2);
                ali_total_price=parseFloat(parseFloat(ali_total_price)+parseFloat(temp1)).toFixed(2);
                ali_stat_price.value=ali_total_price;

                temp2=(tx_sas_price*stat_num[i]).toFixed(2);
                tx_total_price=parseFloat(parseFloat(tx_total_price)+parseFloat(temp2)).toFixed(2);
                tx_stat_price.value=tx_total_price;
                /*tag.value=(0);*/

            }
        }
        tag.value=(0);
        for(var i=0;i<stat_name.length;i++){
            if(stat_name[i]=="SATA"&&stat_num[i]!="0"){
                tag.value=(404);
            }
        }
        //total_price=parseInt(d_sata_price)+parseInt(d_ssd_price)+parseInt(d_sas_price);
        $('#stat_total_price').text("￥"+total_price);


        getAllPrice();

    }
    function getstat_name_count(_arr) {
        var _res = []; //
        _arr.sort();
        for (var i = 0; i < _arr.length;) {
            var count = 0;
            for (var j = i; j < _arr.length; j++) {
                if (_arr[i] == _arr[j]) {
                    count++;
                }
            }
            _res.push([_arr[i], count]);
            i += count;
        }
        //_res 二维数维中保存了 值和值的重复数
        var _newArr = [];
        for (var i = 0; i < _res.length; i++) {
            // console.log(_res[i][0] + "重复次数:" + _res[i][1]);
            _newArr.push(_res[i][0] + '*' + _res[i][1]+'  ');
        }
        return _newArr;
    }
    function brand_price(num) {
        var ali_brand_price=document.getElementById('total_brand_a');
        var tx_brand_price=document.getElementById('total_brand_t');
        var ali_price=0;
        var tx_price=0;
        if(num==0){
            ali_price=0;
            tx_price=0;
            ali_brand_price.value=parseInt(ali_price);
            tx_brand_price.value=parseInt(tx_price);

        }
        if(num==1){
            ali_price=23;
            tx_price=20;
            ali_brand_price.value=parseInt(ali_price);
            tx_brand_price.value=parseInt(tx_price);
        }
        else if(num==2){
            ali_price=46;
            tx_price=40;
            ali_brand_price.value=parseInt(ali_price);
            tx_brand_price.value=parseInt(tx_price);
        }
        else if(num==3){
            ali_price=71;
            tx_price=65;
            ali_brand_price.value=parseInt(ali_price);
            tx_brand_price.value=parseInt(tx_price);
        }
        else if(num==4){
            ali_price=96;
            tx_price=90;
            ali_brand_price.value=parseInt(ali_price);
            tx_brand_price.value=parseInt(tx_price);

        }
        else if(num==5){
            ali_price=125;
            tx_price=115;
            ali_brand_price.value=parseInt(ali_price);
            tx_brand_price.value=parseInt(tx_price);
        }
        else if(num==6){
            ali_price=80;
            tx_price=205;
            ali_brand_price.value=parseInt(ali_price*num);
            tx_brand_price.value=parseInt(tx_price);
        }
        else if(num>6){
            tx_price=(num-5)*90+115;
            tx_brand_price.value=parseInt(tx_price);
            ali_brand_price.value=parseInt(80*num);
        }
    };
    //滚动条触发函数，滚动条用的是bootstrap插件
    var sliders = new Slider('#ex1', {
        formatter: function(value) {

            $('.brand_num').text(value+"MB");
            $('.input_bg').text(value+"MB");
            $('.input_bg').val(value);
            $("#ex1").attr("value",value);
            if(0<value<5){
                $('.brand_price').text("￥"+value*20);
            }
            else {
                $('.brand_price').text("￥"+value*60);
            }


            brand_price(value);
            getAllPrice();
        }
    });
    $(function () {

        $(function () {
            function brand_price(num) {
                var aliPrice_t=document.getElementById("total_cpu_a").value;
                var aliPrice=parseInt(aliPrice_t);
                var txPrice_t=document.getElementById("total_cpu_t").value;
                var txPrice=parseInt(txPrice_t);
                var ali_brand_price=document.getElementById('total_brand_a');
                var tx_brand_price=document.getElementById('total_brand_t');
                var ali_price=0;
                var tx_price=0;
                if(num==0){
                    ali_price=0;
                    tx_price=0;
                    ali_brand_price.value=parseInt(ali_price);
                    tx_brand_price.value=parseInt(tx_price);

                }
                if(num==1){
                    ali_price=23;
                    tx_price=20;
                    ali_brand_price.value=parseInt(ali_price);
                    tx_brand_price.value=parseInt(tx_price);
                }
                else if(num==2){
                    ali_price=46;
                    tx_price=40;
                    ali_brand_price.value=parseInt(ali_price);
                    tx_brand_price.value=parseInt(tx_price);
                }
                else if(num==3){
                    ali_price=71;
                    tx_price=65;
                    ali_brand_price.value=parseInt(ali_price);
                    tx_brand_price.value=parseInt(tx_price);
                }
                else if(num==4){
                    ali_price=96;
                    tx_price=90;
                    ali_brand_price.value=parseInt(ali_price);
                    tx_brand_price.value=parseInt(tx_price);

                }
                else if(num==5){
                    ali_price=125;
                    tx_price=115;
                    ali_brand_price.value=parseInt(ali_price);
                    tx_brand_price.value=parseInt(tx_price);
                }
                else if(num==6){
                    ali_price=80;
                    tx_price=205;
                    ali_brand_price.value=parseInt(ali_price*6);
                    tx_brand_price.value=parseInt(tx_price);
                }
                else if(num>6){
                    tx_price=(num-5)*90+115;
                    tx_brand_price.value=parseInt(tx_price);
                    ali_brand_price.value=parseInt(80*num);
                }
            }
            $('.minus').click(function () {
                var num =parseInt($('.input_bg').val());
                if(num<=0){
                    num=0;
                    brand_price(num);
                    $('.input_bg').val(0);
                    $('.brand_num').text(num+"MB");
                    $('.brand_price').text("￥"+num*40);
                    getAllPrice();
                    sliders.setValue(num);

                }
                else {
                    num=num-1;
                    brand_price(num);

                    $('.input_bg').val(num);

                   // $('.brand_num').text(num+"MB");
                    $('.brand_price').text("￥"+num*40);
                    getAllPrice();
                    sliders.setValue(num);
                }
            })
            /*带宽值得文本框*/
            $('.testNum').on("blur",function (event) {
                var flag=document.getElementById('flag');
                var  flagNum=document.getElementById('flagNum');
                var flag_die=document.getElementById('flag_die');
                var flag_die_flag=document.getElementById('flag_die_flag');
                if(flag_die_flag.value==1){
                    flag_die.value=0;
                }
                var num = parseInt($(this).val());
                if(isNaN(num)){
                    num=0;
                    flag.value=1;
                    flagNum.value=num;
                }
                if(num<=0||num==""){
                    num=0;
                    flag.value=1;
                    flagNum.value=num;
                    brand_price(num);
                    $('.input_bg').val(num);
                    $('.brand_num').text(num+"MB");
                    $('.brand_price').text("￥"+num*40);
                    getAllPrice();
                    //计算滚动条
                    sliders.setValue(num);
                    /*test(num);*/
                }
                else if(num>=300){
                    num=300;
                    flag.value=1;
                    brand_price(num);
                    flagNum.value=num;
                    $('.input_bg').val(num);
                    $('.brand_num').text(num+"MB");
                    $('.brand_price').text("￥"+num*40);
                    getAllPrice();
                     sliders.setValue(num);
                    /*test(num);*/
                }
                else {
                    if(num<0){
                        num=1;
                        flag.value=1;
                        flagNum.value=num;
                    }
                    brand_price(num);
                    $('.input_bg').val(num);
                     $('.brand_num').text(num+"MB");
                    $('.brand_price').text("￥"+num*40);
                    getAllPrice();
                    //计算滚动条

                    sliders.setValue(num);
                    /*test(num);*/
                    return true;
                }

            });
            $('.plus').click(function () {
                var num = parseInt($('.input_bg').val());
                if(num>=300){
                    num=300;
                    brand_price(num);
                    $('.input_bg').val(num);

                    $('.brand_num').text(num+"MB");
                    $('.brand_price').text("￥"+num*40);
                    getAllPrice();
                    //计算滚动条
                    sliders.setValue(num);
                }
                else {
                    num=num+1;
                    brand_price(num);
                    $('.input_bg').val(num);

                    $('.brand_num').text(num+"MB");
                    $('.brand_price').text("￥"+num*40);
                    getAllPrice();
                    //计算滚动条
                    sliders.setValue(num);
                }
            });
            $('#list').on("blur",'.stat_num',function (event) {
                var num = parseInt($(this).val());
                if(isNaN(num)){
                    num=0;
                }
                if(num<=0||num==""){
                    $(this).val(0);
                    //$('.stat_num')
                    count();
                }
                else if(num>=2000){
                    $(this).val(2000);
                    count();
                }
                else {
                    $(this).val(num);
                    count();
                }
            });
            $('#list').on('click','.stat_plus',function (event) {
                console.dir(this);
                var numInput = $(this).prev();
                var stat_num=parseInt(numInput.val());
                if(stat_num>=2000){
                    numInput.val(2000);
                    count();
                }
                else {
                    stat_num=stat_num+1;
                    numInput.val(stat_num);
                    count();
                }
            });
            $('#list').on('click','.stat_minus',function (event) {
                console.dir(this);
                var numInput = $(this).next();
                var stat_num=parseInt(numInput.val());
                if(stat_num<=0){
                    numInput.val(0);
                    count();
                }
                else {
                    stat_num=stat_num-1;
                    numInput.val(stat_num);
                    count();
                }
            });


        });

    });
var index=1;

// 按钮的点击事件
    $(".addConfig").click(function(){
        var uuid = "zhu"+guid();
        console.log(uuid);
        index++;
        var html = "";
        html =  '<li class='+uuid+' data-stat="'+index+'">'+
                '<div class="_config_div left add" id="but'+uuid+'">'+
                '<span class="left stat_text">SATA</span>'+
                '<i class="right "><img src="/pc/image/go_right.png"></i>'+
                '</div>'+
                '<div class="_config_div wid35 left zhuiRou">'+
                '<div class="stat_minus minus1"><i><img src="/pc/image/Group_MINUS.png" class="img_class"></i>'+
                '</div>'+
                '<input type="tel" pattern="[0-9]*" maxlength="4" class="stat_num input_bg1 zhou" value="0">'+
                '<div class="plus1 stat_plus"><i><img src="/pc/image/Group_PLUS.png" class="img_class"></i></div>'+
                '</div>'+
                '<div class="delet right"><img src="/pc/image/Shape.png"></div>'+
                '</li>';

        $(this).before(html);

        //生成选择框
        getPicker(uuid);
        count();
    });
    function getPicker(uuid) {
        var storage="story"+uuid;
        storage  = new mui.PopPicker();
        storage.setData(['SATA','SAS','SSD']);
        var showStoragePicker = document.getElementById('but'+uuid);
        var storageResult = document.getElementById('storageResult');

        showStoragePicker.addEventListener('tap', function(event) {
            console.log(event);
            var priceEditor = this.children[0];

            /*var priceEditor = event.target.children[0];*/
            console.log(priceEditor);
            storage.show(function (items) {
                priceEditor.innerHTML=items[0];
                count();
            });
        });
    }

    //删除的按钮事件
    mui(".config2_ul").on('tap', '.delet', function(event){
        var name=$(this).parent().attr("class");
        console.log(name);

        $("."+name).remove();
        count();

    });
    //用于生成uuid
    function S4() {
        return (((1+Math.random())*0x10000)|0).toString(16).substring(1);
    };
    function guid() {
        return (S4()+S4()+"-"+S4()+"-"+S4()+"-"+S4()+"-"+S4()+S4()+S4());
    };


    //下拉弹出框
    (function($, doc) {
        $.init();
        $.ready(function() {
            count();
            //内存下拉框
            var MemoryPicker = new $.PopPicker();
            //CPU下拉框
            var userPicker = new $.PopPicker();
            userPicker.setData([1,2,4,8,16,32]);
            var showCPUPickerButton = doc.getElementById('showCPUPicker');
            var userResult = doc.getElementById('userResult');
            var cpuCount_f= doc.getElementById("cpuCount");
            var MemoryCount_f= doc.getElementById("MemoryCount");
            var MemoryResult = doc.getElementById('MemoryResult');
            //初始化计算价格
            getEntityPrice(cpuCount_f.innerText,MemoryCount_f.innerText);
            //CPU点击事件
            showCPUPickerButton.addEventListener('tap', function(event) {
                userPicker.show(function(items) {
                    userResult.innerText = items[0];
                    cpuCount.innerText = items[0];
                    getMemory(items[0]);
                    var MemoryCount_s= doc.getElementById("MemoryCount");
                    getEntityPrice(cpuCount_f.innerHTML,MemoryCount_s.innerText);
                });



            }, false);
            MemoryPicker.setData([1,2,4]);
            var showMemoryPicker = doc.getElementById('showMemoryPicker');
            showMemoryPicker.addEventListener('tap', function(event) {
                MemoryPicker.show(function(items) {
                    MemoryCount_f.innerText = items[0]+'GB';
                    MemoryResult.innerHTML=items[0]+'GB';
                    //获取实例配置总价
                    var cpuCount= doc.getElementById("cpuCount");
                    var cpuCountVal=cpuCount.innerText;
                    var memoryCount= document.getElementById("MemoryResult").innerText;
                    var memoryCountVal=memoryCount.substring(0,memoryCount.length-2);
                    getEntityPrice(cpuCountVal,memoryCountVal);

                });
            }, false);
            function getMemory(cpuType) {
                $.get("/search/" + cpuType,function(data){
                    var memoryArray=data.memoryList;
                    var memoryarray=new Array();
                    for (var i=0;i<memoryArray.length;i++){
                        memoryarray[i]=parseInt(memoryArray[i].memory);
                    }

                    showMem(memoryarray,MemoryPicker);
                });

            };
            function showMem(value,pickerType) {
                pickerType.setData(value);
                var showMemoryPicker = doc.getElementById('showMemoryPicker');
                var MemoryResult = doc.getElementById('MemoryResult');
                var cpuCount= doc.getElementById("cpuCount");
                var cpuCountVal=cpuCount.innerText;
                pickerType.pickers[0].setSelectedValue(value[0]);
                var MemoryCount= doc.getElementById("MemoryCount");
                MemoryResult.innerText = value[0]+'GB';
                MemoryCount.innerText = value[0];
                getEntityPrice(cpuCountVal,value[0]);
                showMemoryPicker.addEventListener('tap', function(event) {
                    MemoryPicker.show(function(items) {
                        MemoryResult.innerText = items[0]+'GB';
                        MemoryCount.innerText = items[0];
                        //获取实例配置总价
                        MemoryCountVal=MemoryCount.innerText;

                       getEntityPrice(cpuCountVal,MemoryCountVal);

                    });
                }, false);

            };
            function  getEntityPrice(cpuVal,memVal) {
                var cpuPriceAll=doc.getElementById("cpu_price");
                var cpuPrice=document.getElementById("total_cpu_d");
                var aliPrice=document.getElementById("total_cpu_a");
                var txPrice=document.getElementById("total_cpu_t");
                $.get("/getPrice/"+cpuVal+"/"+memVal,function(data){
                    var prices=data.price;
                    if(prices!=null){
                        if(prices.price==""||prices.price=="0"){
                            getAllPrice();
                        }else{
                            cpuPriceAll.innerHTML="￥"+(parseInt(prices.price));
                            cpuPrice.value=parseInt(prices.price);
                            getAllPrice();
                        }
                        if(prices.ali_price==""||prices.ali_price==null){
                            aliPrice.value=parseInt(0);
                            getAllPrice();
                        }else{
                            aliPrice.value=parseInt(prices.ali_price);
                            getAllPrice();
                        }
                        if(prices.tencent_price==null||prices.tencent_price==""){
                            txPrice.value=parseInt(0);
                            getAllPrice();
                        }
                        else {
                            txPrice.value=parseInt(prices.tencent_price);
                            getAllPrice();
                        }
                    }
                });

            }




            //---------------------------------------------------------------------
            //存储下拉框storageResult
            var storagePicker = new mui.PopPicker();
            storagePicker.setData(['SATA','SAS','SSD']);
            var showstoragePicker = doc.getElementById('showstoragePicker');
            var storageResult = doc.getElementById('storageResult');
            console.log(document === doc);

            showstoragePicker.addEventListener('tap', function(event) {
                console.dir(this);
                console.log(this === showstoragePicker);
                var self = this;
                storagePicker.show(function (items) {
                    console.dir(items);
                    self.children[0].innerHTML = items[0];
                    count();
                });
            });
        });
    })(mui, document);

</script>
<script>
    $(function(){
        $('.checkInfo_right').click(function () {
            var openId=$('#openId').val();
            //CPU
            var userResult=$('#userResult').text();
            var memoryResult=$('#MemoryResult').text();
            userResult="CPU *"+userResult;
            var tatil_stat=$(".tatil_stat").text();//存储配置
            var brand_num=$('.brand').text();//带宽

            //三个价格
            var aliprice=$('#ali_price').text();
            var txprice=$('#tx_price').text();
            var allprice=$('#allprice').text();
            /*if(openId==null){
                alert("添加失败,请重新打开应用");
                return false;
            }*/
            if(aliprice=="无此规格"){
                aliprice=0;
            }
            else {
                aliprice=aliprice.substring(1);
            }
            if(txprice=="无此规格"){
                txprice=0;
            }
            else {
                txprice=txprice.substring(1);
            }
            allprice=allprice.substring(1);

            var data1 = {
                cpuAndMem:userResult,
                meMory:memoryResult,
                stat:tatil_stat,
                brandNum:brand_num,
                ali_price:aliprice,
                tx_price:txprice,
                all_price:allprice,
                productTypeId:1,
                productName:'云主机',
                oneKey:'实例配置',
                twoKey:'存储配置',
                threeKey:'宽带',
                disCount:'1',
                oneImage:'list_icon6',
                twoImage:'list_icon7',
                threeImage:'list_icon10'
                /*openId:openId*/
            }
            $.post("/takeList/"+openId+"/",data1,function(data){
                if(data.type=="success"){
                    layer.msg(data.msg);
                }
             });
        });






    })


</script>


</body>

</html>
